<template>
  <div style="background-color: white; flex: 1">
    <el-tabs v-model="activeName" class="demo-tabs" style="margin-left: 20px" @tab-click="handleClick">
      <el-tab-pane label="粗跟踪设备" name="00">
        <div>
          工作模式：
          <el-select v-model="cgzkzbean.gzms" placeholder="请选择" clearable style="width: 240px; margin: 15px">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>

          <view>目标选择：
            <el-select v-model="cgzkzbean.gzmb" placeholder="请选择目标" style="width: 240px" clearable>
              <el-option v-for="item in option2s" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </view>

          <view v-if="cgzkzbean.gzms == '03'">设置目标属性
            <view>
              坐标X
              <el-input-number v-model="cgzkzbean.numX" :min="0" :max="1000" />
            </view>
            <view>
              坐标Y
              <el-input-number v-model="cgzkzbean.numY" :min="0" :max="1000" />
            </view>
          </view>
        </div>
        <!-- 镜头控制信息： -->
        <div>
          背景选择：
          <el-select v-model="cgzkzbean.xzbj" placeholder="请选择" clearable style="width: 240px; margin: 15px">
            <el-option v-for="item in optionbgs" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </div>

        <div>
          图像功能：
          <el-checkbox v-model="cgzkzbean.checkedqw" label="去雾" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedrh" label="锐化" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedOSD" label="OSD" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedspjl" label="视频记录" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedspjx" label="水平镜像" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedsxfz" label="上下翻转" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedDIS" label="DIS" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedsphf" label="视频回放" size="large" />
        </div>

        <div>
          多光视频：
          <el-checkbox v-model="cgzkzbean.checkeddbhw" label="短波红外" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedzbhw" label="中波红外" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedcbhw" label="长波红外" size="large" />
          <el-checkbox v-model="cgzkzbean.checkedgsxj" label="高速相机" size="large" />
        </div>

        <div>
          自动聚焦控制：
          <el-switch v-model="cgzkzbean.zdjj" size="large" active-text="打开" inactive-text="关闭" />

          <view style="margin-left: 10px">
            滤光信息(存疑)：
            <el-select v-model="cgzkzbean.lgxx" placeholder="请选择" clearable style="width: 240px; margin: 15px">
              <el-option v-for="item in option5s" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </view>
        </div>

        <div>
          对焦:
          <el-select v-model="cgzkzbean.dj" placeholder="请选择" clearable style="width: 240px; margin: 15px">
            <el-option v-for="item in option3s" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>

          <view>
            焦距信息：
            <el-select v-model="cgzkzbean.jjxx" placeholder="请选择" clearable style="width: 240px; margin: 15px">
              <el-option v-for="item in option4s" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>
          </view>
        </div>

        <div>
          自动跟踪控制：
          <el-switch v-model="cgzkzbean.zdgzkz" size="large" active-text="打开" inactive-text="关闭" />

          <view style="margin-left: 10px">
            目标距离（存疑）：
            <el-input-number v-model="cgzkzbean.mbjl" :min="0" :max="1000" />m
          </view>
        </div>

        <div>
          <view>
            转台方位角度:
            <el-select v-model="cgzkzbean.ztfw_sp" placeholder="请选择" clearable style="width: 100px; margin: 5px">
              <el-option key="0" label="左转" value="0" />

              <el-option key="1" label="右转" value="1" />
            </el-select>
            <el-input-number v-model="cgzkzbean.ztfw_sp_value" :min="0" :max="180" />
          </view>
          <view>
            转台俯仰角度:
            <el-select v-model="cgzkzbean.ztfw_cz" placeholder="请选择" clearable style="width: 100px; margin: 5px">
              <el-option key="0" label="向上" value="0" />

              <el-option key="1" label="向下" value="1" />
            </el-select>
            <el-input-number v-model="cgzkzbean.ztfw_cz_value" :min="0" :max="180" />
          </view>
        </div>
      </el-tab-pane>
      <el-tab-pane label="精确跟踪设备" name="01"> </el-tab-pane>
      <el-tab-pane label="偏摆镜设备" name="02">

        <div>
          开环闭环：
          <el-select v-model="pzjkzbean.khbh" placeholder="请选择" clearable style="width: 240px; margin: 15px">
            <el-option v-for="item in optionskhbh" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>


          <div v-if="pzjkzbean.khbh && pzjkzbean.khbh == '1'">
            <view style="margin-left: 5px;">
              通道1电压:
              <!-- <el-input v-model="pzjkzbean.kh.dy1" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.dy1" :min="0" :max="180" />
            </view>

            <view style="margin-left: 5px;">
              通道2电压:
              <!-- <el-input v-model="pzjkzbean.kh.dy2" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.dy2" :min="0" :max="180" />
            </view>

            <view style="margin-left: 5px;">
              通道3电压:
              <!-- <el-input v-model="pzjkzbean.kh.dy3" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.dy3" :min="0" :max="180" />
            </view>



          </div>

          <div v-if="pzjkzbean.khbh && pzjkzbean.khbh == '2'">
            <view style="margin-left: 5px;">
              通道1偏移量:
              <!-- <el-input v-model="pzjkzbean.kh.py1" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.py1" :min="0" :max="180" />
            </view>

            <view style="margin-left: 5px;">
              通道2偏移量:
              <!-- <el-input v-model="pzjkzbean.kh.py2" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.py2" :min="0" :max="180" />
            </view>

            <view style="margin-left: 5px;">
              通道3偏移量:
              <!-- <el-input v-model="pzjkzbean.kh.py3" style="width: 240px" placeholder="input" clearable /> -->
              <el-input-number v-model="pzjkzbean.kh.py3" :min="0" :max="180" />
            </view>



          </div>


          <div v-if="pzjkzbean.khbh" style="margin-top: 5px;margin-bottom: 5px;">状态参数返回区域</div>
          <div v-if="pzjkzbean.khbh" style="border: 1px solid #edeeed; padding-bottom: 5px">
            <view v-if="pzjkzbean.khbh && pzjkzbean.khbh == '1'">
              当前模式：开环
              <view>
                <div>第1个通道电压: 36</div>
                <div>第2个通道电压: 24</div>
                <div>第3个通道电压: 24</div>
              </view>
            </view>

            <view v-else-if="pzjkzbean.khbh && pzjkzbean.khbh == '2'">
              当前模式：闭环
              <view>
                <div>第1个通道偏移量: 1.1</div>
                <div>第2个通道偏移量: 1.2</div>
                <div>第3个通道偏移量: 1.3</div>
              </view>
            </view>
          </div>

          <view v-if="pzjkzbean.khbh && pzjkzbean.khbh == '3'">


            串口连接：
            <el-select v-model="pzjkzbean.gzms" placeholder="请选择" clearable style="width: 240px; margin: 15px">
              <el-option v-for="item in optionscklj" :key="item.value" :label="item.label" :value="item.value" />
            </el-select>



            <div>
              <view v-if="pzjkzbean.gzms == 'E18'">设置目标属性
                <view>
                  通道
                  <el-select v-model="pzjkzbean.E18.td" placeholder="请选择" clearable style="width: 240px; margin: 15px">
                    <el-option v-for="item in optionstd" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </view>

                <view>
                  地址
                  <el-input v-model="pzjkzbean.E18.dz" style="width: 240px" placeholder="input" clearable />
                </view>

                <view>
                  电压-位移值
                  <el-input v-model="pzjkzbean.E18.dywyz" style="width: 80px" placeholder="input" clearable />
                </view>



                <div> 波形发送
                  <view>
                    峰值
                    <el-input v-model="pzjkzbean.E18.bxfs.fz" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    频率
                    <el-input v-model="pzjkzbean.E18.bxfs.pl" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    偏移
                    <el-input v-model="pzjkzbean.E18.bxfs.py" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    波类型
                    <el-select v-model="pzjkzbean.E18.bxfs.blx" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsblx" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                  </view>

                  <view>
                    发送模式
                    <el-select v-model="pzjkzbean.E18.bxfs.fsms" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsfsms" :key="item.value" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </view>

                </div>



                <div> 相位/波形发送
                  <view>
                    峰值
                    <el-input v-model="pzjkzbean.E18.xw_bxfs.fz" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    频率
                    <el-input v-model="pzjkzbean.E18.xw_bxfs.pl" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    偏移
                    <el-input v-model="pzjkzbean.E18.xw_bxfs.py" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    相位
                    <el-input v-model="pzjkzbean.E18.xw_bxfs.xw" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    波类型
                    <el-select v-model="pzjkzbean.E18.xw_bxfs.blx" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsblx" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                  </view>

                  <view>
                    发送模式
                    <el-select v-model="pzjkzbean.E18.xw_bxfs.fsms" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsfsms" :key="item.value" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </view>

                </div>


                <div> 周期/波形发送
                  <view>
                    峰值
                    <el-input v-model="pzjkzbean.E18.zq_bxfs.fz" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    频率
                    <el-input v-model="pzjkzbean.E18.zq_bxfs.pl" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    偏移
                    <el-input v-model="pzjkzbean.E18.zq_bxfs.py" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    周期
                    <el-input v-model="pzjkzbean.E18.zq_bxfs.zq" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    波类型
                    <el-select v-model="pzjkzbean.E18.zq_bxfs.blx" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsblx" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                  </view>

                  <view>
                    发送模式
                    <el-select v-model="pzjkzbean.E18.zq_bxfs.fsms" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsfsms" :key="item.value" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </view>

                </div>

                <div> 周期/相位波形发送
                  <view>
                    峰值
                    <el-input v-model="pzjkzbean.E18.zq_xwbxfs.fz" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    频率
                    <el-input v-model="pzjkzbean.E18.zq_xwbxfs.pl" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    偏移
                    <el-input v-model="pzjkzbean.E18.zq_xwbxfs.py" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    相位
                    <el-input v-model="pzjkzbean.E18.zq_xwbxfs.xw" style="width: 80px" placeholder="input" clearable />
                  </view>

                  <view>
                    波类型
                    <el-select v-model="pzjkzbean.E18.zq_xwbxfs.blx" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsblx" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                  </view>

                  <view>
                    发送模式
                    <el-select v-model="pzjkzbean.E18.zq_xwbxfs.fsms" placeholder="请选择" clearable
                      style="width: 240px; margin: 15px">
                      <el-option v-for="item in optionsfsms" :key="item.value" :label="item.label"
                        :value="item.value" />
                    </el-select>
                  </view>

                </div>




              </view>
            </div>

          </view>



        </div>



      </el-tab-pane>
      <el-tab-pane label="激光器设备" name="03">快反</el-tab-pane>
    </el-tabs>

    <!-- <p class="description">配置管理界面</p> -->
    <el-button type="primary" style="margin-top: 20px" @click="getWeb">确认</el-button>

    <!-- <el-button type="primary" style="margin-top: 20px" @click="setDate">存数据</el-button>

    <el-button type="primary" style="margin-top: 20px" @click="getDate">取数据</el-button> -->
  </div>
</template>

<script>
import axiosApi from "@/utils/http";
// @/views/example/hello/Index.vue
// import axios from "axios";
export default {
  name: "TopMenu",

  data() {
    return {
      activeName: "00",
      value: "",
      cgzkzbean: {},


      options: [
        {
          value: "01",
          label: "目标搜索",
        },
        {
          value: "02",
          label: "目标选择",
        },
        {
          value: "03",
          label: "手动跟踪",
        },
      ],

      numX: 0,
      numY: 0,
      value2: "",
      option2s: [
        {
          value: "01",
          label: "无人机（亮）",
        },
        {
          value: "02",
          label: "无人机（暗）",
        },
        {
          value: "03",
          label: "人",
        },
        {
          value: "04",
          label: "车",
        },
        {
          value: "05",
          label: "船",
        },
        {
          value: "06",
          label: "鸟",
        },
      ],

      value3: "",
      option3s: [
        {
          value: "01",
          label: "精聚焦-",
        },
        {
          value: "02",
          label: "精聚焦+",
        },
        {
          value: "03",
          label: "停止聚焦",
        },
        {
          value: "04",
          label: "粗聚焦-",
        },
        {
          value: "05",
          label: "粗聚焦+",
        },
      ],

      value4: "",
      option4s: [
        {
          value: "01",
          label: "变倍+",
        },
        {
          value: "02",
          label: "变倍-",
        },
        {
          value: "03",
          label: "停止调焦",
        },
        {
          value: "04",
          label: "连续变焦+",
        },
        {
          value: "05",
          label: "连续变焦-",
        },
      ],

      value5: "",
      option5s: [
        {
          value: "01",
          label: "透雾功能（开）",
        },
        {
          value: "02",
          label: "透雾功能（关）",
        },
      ],

      valuebg: "",
      optionbgs: [
        {
          value: "01",
          label: "空天背景",
        },
        {
          value: "02",
          label: "地面背景",
        },
        {
          value: "03",
          label: "水面背景",
        },
      ],

      value6: "",
      value7: "",





      // 偏转镜
      pzjkzbean: {
        "gzms": '',
        "kh": {},
        "bh": {},
        "E18": {
          "bxfs": {


          },
          "xw_bxfs": {


          },
          "zq_bxfs": {


          },
          "zq_xwbxfs": {


          },
          "y_zxdjfs": {


          },
          "e_zxdjfs": {


          }

        },
        "E18_1": {

        }

      },


      optionscklj: [
        {
          value: "E18",
          label: "E18",
        },
        {
          value: "E18_1",
          label: "E18_1",
        },
      ],

      optionstd: [
        {
          value: "1",
          label: "1",
        },
        {
          value: "2",
          label: "2",
        },
      ],

      optionsblx: [
        {
          value: "1",
          label: "正旋波",
        },
        {
          value: "2",
          label: "方波",
        }, {
          value: "3",
          label: "三角波",
        }, {
          value: "4",
          label: "锯齿波",
        }
      ],

      optionsfsms: [
        {
          value: "1",
          label: "单路告诉电压波形",
        },
        {
          value: "2",
          label: "相位可调并发电压波形",
        }, {
          value: "3",
          label: "周期发单路高速电压波形",
        }, {
          value: "4",
          label: "周期相位可调并发电压表波",
        }, {
          value: "5",
          label: "正旋波开环叠加",
        },
      ],


      optionskhbh: [
        {
          value: "1",
          label: "开环",
        },
        {
          value: "2",
          label: "闭环",
        }
      ],

    };
  },

  methods: {
    getWeb() {
      // let parm = {
      //   action: "getAgent",
      // };

      // axiosApi("wapController.jsp", parm, "post").then((res) => {});

      let parm = {};

      axiosApi("app-api/transport/send", parm, "get").then((res) => {
        //服务器测试接口
        console.log(res);
      });
    },

    setDate() {
      localStorage.setItem("myData", "测试文件数据的存储");
    },
    getDate() {
      let inputValue = localStorage.getItem("myData") || "";
      console.log("inputValue=" + inputValue);
    },
  },
};
</script>

<style scoped>
.top-menu {
  background-color: #333;
  color: white;
  padding: 10px;
}

.top-menu a {
  color: white;
  text-decoration: none;
  margin-right: 20px;
  display: inline-block;
}

.top-menu a.active {
  font-weight: bold;
}
</style>
